<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>AdminLTE 3 | Data Tables</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <style type="text/css">
        body, html, #allmap {
            width: 100%;
            height: 800px;
            overflow: hidden;
            margin: 0;
            font-family: "微软雅黑";
        }
    </style>

</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <!-- Main content -->
    <section class="content">
        <div id="DIV_MAP" class="DataMain">
            <div id="allmap"></div>
        </div>
    </section>
    <!-- /.content -->
    <footer class="main-footer text-center" style="margin-left: 0%;">
        <div class="d-none d-sm-block">
            <b>版本:</b> 1.0
        </div>
        <!-- 按钮触发模态框 -->
        <strong>Copyright &copy; 2014-2018 <a href="http://adminlte.io">咸阳恒源汽贸有限公司</a>.</strong>保留所有权.
    </footer>

    <!-- Control Sidebar -->
    <aside class="control-sidebar control-sidebar-dark">
        <!-- Control sidebar content goes here -->
    </aside>
    <!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="max-width: 1000px;">
        <div class="modal-content">
            <div class="modal-header">

                <h4 class="modal-title" id="myModalLabel">创业者青年信息</h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <!-- form start -->
                <form role="form" action="" id="form_submit">
                    <div class="row">
                        <div class="col-lg-2 mt-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;用户编号
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9 mt-2">
                            <div class="form-group">
                                <input name="code" type="text" class="form-control" id="u_id" placeholder=""
                                       disabled>
                                <input name="fid" type="text" class="form-control" id="u_fid" placeholder=""
                                       style="display: none">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2 mt-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;用户姓名
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9 mt-2">
                            <div class="form-group">
                                <input name="name" type="text" class="form-control" id="u_name" value="刘禹哲">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;最高学历
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <!-- /.form-group -->
                            <div class="form-group">
                                <select id="eduction" name="eduction" class="form-control select2" style="width: 100%;">
                                    <option value="专科">专科</option>
                                    <option value="本科">本科</option>
                                    <option value="硕士">硕士</option>
                                    <option value="博士">博士</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;毕业院校
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="form-group">
                                <input name="university" type="text" class="form-control" id="u_school" value="牛津大学">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;在职职位
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="form-group">
                                <input name="positon" type="text" class="form-control" id="u_position" value="总经理">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;出生日期
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="form-group">
                                <input name="birth" type="text" class="form-control" id="u_birth" value="1976-2-15">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;联系电话
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="form-group">
                                <input name="tel" type="text" class="form-control" id="u_tel" value="18766881688">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2">
                            <div class="">
                                <div style=" line-height: 1.5em;margin-top: 6px;" class="text-center"><code>*</code>&nbsp;&nbsp;联系邮箱
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="form-group">
                                <input name="mail" type="text" class="form-control" id="u_email"
                                       value="user_cz688@163.com">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="save" type="button" class="btn btn-primary">保存</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<!--点击删除按钮后弹出的页面-->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">
                    提示
                </h4>
                <!--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">-->
                <!--&times;-->
                <!--</button> -->
            </div>
            <div class="modal-body">
                你确定要删除该条信息吗？
                <input id="del_id" style="display: none"/>
            </div>
            <div class="modal-footer">
                <button id="delBtn" type="submit" class="btn btn-primary" value="submit" >确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


<!-- page script -->
<!--<script>
    $(function () {
        $("#myModal").on("hidden.bs.modal", function() {
            $('#myModal').removeData("bs.modal");
        });


        var user_table = $('#example2').DataTable({
            "language": {
                "url": "./plugins/datatables/chinese.txt"
            },
            "serverSide": true,
            "paging": true,
            "lengthChange": true,
            "searching": true,
            "ordering": true,
            "info": true,
            "autoWidth": false,
            "ajax": {
                "url": './UserList.action?type=1',
                "type": 'POST'
            },
            columns: [
                {
                    "data": null,
                    "title": "序号",
                    "sClass": "text-tables-center text-center",
                    "createdCell": function (nTd, sData, oData, iRow, iCol) {
                        var startnum = this.api().page() * (this.api().page.info().length);
                        $(nTd).html(iRow + 1 + startnum); //分页行号累加：$(nTd).html(iRow+1);
                    }
                },
                {data: 'name', 'sClass': "text-center"},
                {data: 'birth', 'sClass': "text-center"},
                {data: 'eduction', 'sClass': "text-center"},
                {data: 'university', 'sClass': "text-center"},
                {data: 'positon', 'sClass': "text-center"},
                {data: 'tel', 'sClass': "text-center"},
                {data: 'mail', 'sClass': "text-center"},
                {
                    data: 'fid', 'sClass': "text-center",
                    render: function (data, type, row) {
                        var id = row.fid == undefined ? -1 : row.fid;//-1说明是新增，其余表示为编辑
                        return "<i class='fa fa-pencil l-fa edit-btn' style='cursor: pointer' id=\'" + id + "\'></i>&nbsp;&nbsp;<i class='fa fa-trash-o m-fa del-btn' style='cursor: pointer' id=\'" + id + "\'></i>";
                    }
                }
            ]
        });

        function userSearchBtn() {
            user_table.ajax.reload();   // 这边的user_table，是由初始化datatables的变量名
        }

        //点击编辑图标出现编辑框
        $("#example2 tbody").unbind('click').on("click", ".edit-btn", function () {
            var id = $(this).attr("id");
            if (id!=-1)
            {
                var url = encodeURI("./getUserFounder.action");
                $.ajax({
                    type: 'POST',
                    url: url,
                    data: {
                        "contentId":id
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.success) {
                            //刷新表格
                            var data = result.data;
                            $("#u_id").val("FU00"+data.fid);
                            $("#u_fid").val(data.fid);
                            $("#u_name").val(data.name);
                            $("#u_position").val(data.positon);
                            $("#u_school").val(data.university);
                            $("#u_tel").val(data.tel);
                            $("#u_email").val(data.mail);
                            $("#u_birth").val(data.birth);

                            var options = $("#eduction").children();
                            $.each(options, function (i, val) {
                                var jqob = $(val);
                                //把input变为字符串
                                if (jqob.val()==data.eduction) {
                                    $("#eduction").val(jqob.val()).trigger("change");
                                   jqob.attr("selected","selected");
                                }
                            });



                            $('#myModal').modal('show');
                        } else {

                        }
                    },
                    dataType: "json"
                });
            }else{
                $('#myModal').modal('show');
            }

        });

        //删除
        $("#example2 tbody").on("click", ".del-btn", function () {
            var id = $(this).attr("id");
            $("#del_id").val(id);

            $('#deleteModal').modal('show');
            $("#deleteModal").bind('hide.bs.modal', function () {
                $(".modal-backdrop").remove();
            });

            $("#deleteModal").on('hidden.bs.modal', '.modal', function () {
                $(this).removeData('bs.modal');
            });


        });


        //保存按钮
        $("#example2 tbody").on("click", ".save-btn", function () {
            var id = $(this).attr("id");
            var tds = $(this).parents("tr").children();
            var sTds = tds.length;
            var lisval = [];
            for (var i = 0; i < sTds; i++) {
                if (i < sTds - 1)
                    lisval.push(tds.eq(i).children("input").val());
                else lisval.push(tds.eq(i).children("input").val())
            }
            if (i == sTds - 1) lisval.push();
            if (lisval[1] == "") {
                toNotification("警告！", "证照属性设置不能为空！", "warning");
                return false;
            } else if (lisval[1].length > 10) {
                toNotification("警告！", "证照属性设置不能超过十个字符！", "warning");
                return false;
            } else {
                $.each(tds, function (i, val) {
                    var jqob = $(val);
                    //把input变为字符串
                    if (!jqob.has('i').length) {
                        var txt = jqob.children("input").val();
                        jqob.html(txt);
                    }
                });
                $(this).toggleClass("edit-btn fa-pencil");
                $(this).toggleClass("save-btn fa-save");
                //保存数据
                SaveData(lisval, id);
            }

        });


        //证照属性设置保存信息
        $("#save").on("click", function SaveData() {
            var data = $('form').serialize();
            //序列化获得表单数据，结果为：user_id=12&user_name=John&user_age=20
            var submitData = decodeURIComponent(data, true);
            //submitData是解码后的表单数据，结果同上
            var url = encodeURI("./saveUserInnovatetutor.action");
            $.ajax({
                type: 'POST',
                url: url,
                data: data,
                dataType: "json",
                success: function (result) {
                    if (result.success) {
                        //刷新表格
                        $("#myModal").modal('hide');  //手动关闭
                        userSearchBtn();
                    } else {
                        //刷新表格
                        $("#myModal").modal('hide');  //手动关闭
                        userSearchBtn();
                    }

                    $("#myModal").bind('hide.bs.modal', function () {
                        $(".modal-backdrop").remove();
                    });
                },
                dataType: "json"
            });
        });

        //证照属性设置新添加信息
        $("#add").on("click", function SaveData() {
            $("#u_id").val("");
            $("#u_fid").val("");
            $("#u_name").val("");
            $("#u_position").val("");
            $("#u_school").val("");
            $("#u_tel").val("");
            $("#u_email").val("");
            $("#u_birth").val("");
            $('#myModal').modal('show');
        });


        //证照属性设置删除
        $("#delBtn").on("click", function () {
            var id = $("#del_id").val();
            var data = {"contentId": id};
            var url = "./deleteUserInnovatetutor.action";
            //执行删除
            $.ajax({
                type: 'POST',
                url: url,
                data: data,
                dataType: "json",
                success: function (result) {
                    if (result.success) {

                        userSearchBtn();
                    } else {
                        userSearchBtn();
                    }
                    $('#deleteModal').modal('hide');
                },
                dataType: "json"
            });

        });

        //获得标识
        function getActionId() {
            return new Date().getTime();
        }

        $('.select2').select2();
        //Date range picker
        //定义locale汉化插件
        var locale = {
            "format": 'YYYY-MM-DD',
            "separator": " -222 ",
            "applyLabel": "确定",
            "cancelLabel": "取消",
            "fromLabel": "起始时间",
            "toLabel": "结束时间'",
            "customRangeLabel": "自定义",
            "weekLabel": "W",
            "daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
            "monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
            "firstDay": 1
        };
        $('#u_birth').daterangepicker({
            'locale': locale,
            startDate: moment().subtract(0, 'days'),
            singleDatePicker: true,
            format: 'YYYY-MM-DD'
        });
        $('#u_birth').val(moment().subtract('0', 'days').format('YYYY-MM-DD'));


    })
    ;

</script>-->

<script type="text/javascript">
    function createMap(flag,longitude,latitude) {
        if(flag){
            // 百度地图API功能
            var map = new BMap.Map("allmap");
            var point = new BMap.Point(longitude, latitude);
            map.centerAndZoom(point, 20);

            var marker = new BMap.Marker(new BMap.Point(116.404, 39.915)); // 创建点
            var polyline = new BMap.Polyline([
                new BMap.Point(116.399, 39.910),
                new BMap.Point(116.405, 39.920),
                new BMap.Point(116.425, 39.900)
            ], {strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5});   //创建折线

            var circle = new BMap.Circle(point, 500, {strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5}); //创建圆

            var polygon = new BMap.Polygon([
                new BMap.Point(116.387112, 39.920977),
                new BMap.Point(116.385243, 39.913063),
                new BMap.Point(116.394226, 39.917988),
                new BMap.Point(116.401772, 39.921364),
                new BMap.Point(116.41248, 39.927893)
            ], {strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5});  //创建多边形

            var pStart = new BMap.Point(116.392214, 39.918985);
            var pEnd = new BMap.Point(116.41478, 39.911901);
            var rectangle = new BMap.Polygon([
                new BMap.Point(pStart.lng, pStart.lat),
                new BMap.Point(pEnd.lng, pStart.lat),
                new BMap.Point(pEnd.lng, pEnd.lat),
                new BMap.Point(pStart.lng, pEnd.lat)
            ], {strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5});  //创建矩形

            //添加覆盖物
            function add_overlay() {
                map.addOverlay(marker);            //增加点
                map.addOverlay(polyline);          //增加折线
                map.addOverlay(circle);            //增加圆
                map.addOverlay(polygon);           //增加多边形
                map.addOverlay(rectangle);         //增加矩形
            }
            //清除覆盖物
            function remove_overlay() {
                map.clearOverlays();
            }
            map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
        }
    }


</script>

</body>
</html>
